<template>
  <div>
    <div v-for="(x,y,index) in MongoList">
      {{y}}
      <p><a-date-picker @change="onChange" v-if="x=='date'&& y=='请假日期'" /></p>
      <p><a-date-picker @change="onChange" v-if="x=='date'&& y=='结束日期'" /></p>
<!--      请假人和请假原因-->
      <a-input type="j" v-if="x=='txt'"></a-input>
<!--      审核人-->
      <select v-if="x=='select'">
        <option :value="f.id" v-for="f in UserList">{{f.username}}</option>
      </select>
    </div>
  </div>
</template>

<script>
export default {
  name: "Leave",
  data() {
    return {
      // 用户id
      id: this.$route.query.id,
      // MongoDB列表
      MongoList:[],
      // 用户列表
      UserList:[],
    }
  },
  methods:{
    onChange(date, dateString) {
      console.log(date, dateString);
    },
    // 获取MongoDB中的数据
    getMongo(){
      this.$axios.get('http://127.0.0.1:8000/getmongo/?id='+this.id)
      .then(res=>{
        console.log(res.data)
        this.MongoList=res.data
      })
    },
    // 获取用户名
    getSelect(){
      this.$axios.get('http://127.0.0.1:8000/user/')
      .then(res=>{
        console.log(res.data)
        this.UserList=res.data
      })
    }
  },
  mounted() {
    this.getMongo();
    this.getSelect();
  }
}
</script>

<style scoped>

</style>
